// JavaScript Document

$(function(){

	//地图中点的坐标
	var arrLocation = [
		{x:570, y:230},	//1
		{x:596, y:150},	//2
		{x:586, y:359},	//3
		{x:577, y:459},	//4
		{x:493, y:232},	//5
		{x:507, y:305},	//6
		{x:513, y:396},	//7
		{x:450, y:469},	//8
		{x:383, y:260},	//9
		{x:413, y:340},	//10
		{x:385, y:423},	//11
		{x:361, y:511},	//12
		{x:285, y:314},	//13
		{x:286, y:414},	//14
		{x:217, y:188},	//15
		{x:158, y:260},	//16
		{x:177, y:367}	//17
	];
	var strMap = '';
	var oMap = document.getElementById('map');
	
	for( var i = 0; i < arrLocation.length; i++ ){
		if( i == 0 ){
			strMap += '<div class="location loc'+ (i+1) +' active" style="left:'+ (arrLocation[i]['x']-15) +'px;top:'+ (arrLocation[i]['y']-15) +'px"><div></div><div></div><div></div></div>';
		}else{
			strMap += '<div class="location loc'+ (i+1) +'" style="left:'+ (arrLocation[i]['x']-15) +'px;top:'+ (arrLocation[i]['y']-15) +'px"><div></div><div></div><div></div></div>';
		}
	}
	oMap.innerHTML += strMap;
	
	//text
	$('.text1 span').each(function(index) {
		setTimeout(function(){
			setTimeout(function(){
				$('.text1 span').eq(index).fadeIn(600);
			}, 250*index);
		},1500)
	});
	
//num
	var url = "http://api.guoluke.com/client/gettotalusers.html?jsonpCallback=jsonpCallback";
		$.ajax({  
			url:url,  
			dataType:'jsonp',  
			data:'',  
			jsonp:'jsonpCallback', 
			async : true, 
			success:function(data) {  
				
			},error:function(data){
				 
			},
			timeout:5000  
		}); 
	//svg
	var objAttr = {'stroke': 'white', 'stroke-opacity': '0.3', 'stroke-width': '1.5', 'stroke-dasharray': '1000 1000', 'stroke-dashoffset': '1000'};
	for( var attr in objAttr ){
		$('line').attr(attr, objAttr[attr]);
	}
	$('line').each(function() {
    var _this = $(this);
		var dashoffset  = _this.attr('stroke-dashoffset');
		var iTimer = null;
		var index = _this.parent().index();
		
		setTimeout(function(){
			clearInterval(iTimer);
			iTimer = setInterval(function(){
				dashoffset -= 5;
				_this.attr('stroke-dashoffset', dashoffset)
				if( dashoffset <= 10 ){
					clearInterval(iTimer);
				}
			}, 40)
		}, 800*index)
  });
	
	//slide
setTimeout(function(){slide($("#slidebox2"))}, 2000);
setTimeout(function(){slide($("#slidebox3"))}, 2000);

	function slide(obj){
		var page = 1,
 		oUl = obj.children('ul'),
 		aLi = oUl.find('li'),
 		widLi = aLi.eq(0).width(),
 		numLi = aLi.length;
		oUl.width( widLi * numLi + 'px');
		setInterval( slideLeft, 2000 );
		function slideLeft(){
			if( numLi > 1  ){
				var scrollLeft = function(){
   						oUl.animate({ 'margin-left' : -widLi }, 600 ,function(){
		    					oUl.css({'margin-left':'0px'}).find('li').eq(0).appendTo(oUl);
						});
				}
				if( page == numLi ){
					scrollLeft();
   			page = 1;
				}else{
					scrollLeft();
   			page ++;
				}
			}
		}
	}	
//游戏

	setTimeout(function(){slide1($("#slidebox1"))}, 4400);
	function slide1(obj){
		var page = 1,
 		oUl = obj.children('ul'),
 		aLi = oUl.find('li'),
 		widLi = aLi.eq(0).width(),
 		numLi = aLi.length;
 		
		oUl.width( widLi * numLi + 'px');             
		
		function slideLeft1(){
			if( numLi > 1  ){	
				var scrollLeft1 = function(){
   					$(".play_img_f").animate({ 'margin-left' : -253 },600,function(){
   						
// 						$(".play_img li:eq(0)").animate({ 'margin-top' : -470 },600,function(){
			               $(".play_img li:eq(1)").animate({ 'margin-top' : -412 },600,function(){
					          $(".play_img li:eq(2)").animate({ 'margin-top' : -354 },600,function(){
				                  $(".play_img li:eq(3)").animate({ 'margin-top' : -296 },600,function(){
				                  	$(".play_img li:eq(4)").animate({ 'margin-top' : -238 },600,function(){
				                  	   $(".play_img li:eq(5)").animate({ 'margin-top' : -180},600,function(){
				                  	     $(".play_img li:eq(6)").animate({ 'margin-top' : -122},600,function(){
				                  	        $(".play_img li:eq(7)").animate({ 'margin-top' : -64},600,function(){
				                  	        	$(".play_img li:eq(7)").animate({ 'margin-top' : 0},100,function(){
				                  	        		$(".play_img_f").animate({ 'margin-left' : 0 },800);
				                  	        	});
				                  	        	$(".play_img li:eq(6)").animate({ 'margin-top' : 0},100);
				                  	        	$(".play_img li:eq(5)").animate({ 'margin-top' : 0},100);
				                  	        	$(".play_img li:eq(4)").animate({ 'margin-top' : 0},100);
				                  	        	$(".play_img li:eq(3)").animate({ 'margin-top' : 0},100);
				                  	        	$(".play_img li:eq(2)").animate({ 'margin-top' : 0},100);
				                  	        	$(".play_img li:eq(1)").animate({ 'margin-top' : 0},100);
				                  	        	$(".play_img li:eq(0)").animate({ 'margin-top' : 0},100);
//				                             })
				                         })
				                       })
				                    })
				                  })
					           });
				            });	
		                });
		                
		             });   
				}
				if( page > 1 ){
					scrollLeft1();
   			page = 1;
				}else{
					scrollLeft1();
   			page ++;
				}
			}
		}
		slideLeft1();
		setInterval( slideLeft1, 8000 );
	}
	//fixbar
	$(window).scroll(function(){
		//fixbar
		var scrollTop = $(window).scrollTop();
		var windowH = $(window).height();
		if(scrollTop > 300){
			$('.fixbar').show();
		}else{
			$('.fixbar').hide();
		}
		
//		//friendlink
//		var pt = $('.partner').offset().top;
//		if(scrollTop + windowH > pt){
//			$('.friendlink .front').removeClass('unflip').addClass('flipped');
//			$('.friendlink .back').addClass('unflip').removeClass('flipped');
//		}
	})
	var timer = null;
	$('.fixbar > div').on({
		mouseover: function(){
			clearTimeout(timer);
			$(this).find('span').show();
			$(this).siblings().find('span').hide();
		},
		mouseout: function(){
			var _this = $(this);
			timer = setTimeout(function(){
				_this.find('span').hide();
			},200);
		}
	})	
	$('.totop').click(function(){
		$( 'body,html' ).animate({scrollTop:0},300);
	})
	
})

function jsonpCallback(result) {  
		var nums= result.result;
		nums = nums.toString();
		var arrNum = nums.split("");
		setTimeout(function(){
			$('.text2').css('display','-webkit-box');
			$('.text2').css('display','-moz-box');
			$('.text2').css('display','-ms-box');
			$('.text2').css('display','-o-box');
			$('.text2').css('display','block');
			$('.num span').each(function(index) {
				var _this = $(this);
				$(this).animate({
					move:'auto'
				},{
					duration:'5s',
					easing:'swing',
					step:function(a,b){
						_this.css({'background-position': '0 -'+ arrNum[index]*65*b.pos +'px'});
					}
				})
			});
		}, 1500)
	}